<template>
	<eui-page-frame topHeight="255">
		<template #top>
			<view class="content-img">
				<eui-navbar ref="EuiNavBar" title="选择生鲜采购单" color="#000000" backgroundColor="#FFFFFF">
				</eui-navbar>
				<view class="top-view">
					<eui-search-bar ref="RdsSearchBar" v-model="searchText" placeholder="请输入单号、商品编码"
						leftIcon="icon-saoyisao" @confirm="searchConfirm" @leftIconClick="scanCode" radius="30">
						<!-- <template v-slot:searchFields>
							<view class="search-fields">
								<view class="center">
									<eui-card-input class="search-field" v-model="formData.c_mk_dt_s" title="开始日期"
										placeholder="请选择开始日期" type="date" :displayable="false" rightIconType="clear" @iconClick="clear" singleTag="c_mk_dt_s"/>
									<eui-card-input class="search-field" v-model="formData.c_mk_dt_e" title="结束日期"
										placeholder="请选择结束日期" type="date" :displayable="false" rightIconType="clear" @iconClick="clear" singleTag="c_mk_dt_e"/>
								</view>
								<view class="bottom flex-1 flex bt-button">
									<eui-button type="max2" title="重置" singleTag="reset"
										@buttonClick="confirm"></eui-button>
									<eui-button type="max" title="确认" singleTag="fix"
										@buttonClick="confirm"></eui-button>
								</view>
							</view>
						</template> -->
					</eui-search-bar>
				</view>
			</view>
		</template>
		<eui-page-content>
			<view class="footer-view">
				<scroll-view :scroll-top="0" scroll-y="true" style="height: auto;" @scrolltolower="loadMore">
					<eui-base-card v-for="(item, index) in dataList" :key="index" @click="templateClick(item)">
						<eui-detail-show :items="Items" v-model="dataList[index]" size="small"></eui-detail-show>
					</eui-base-card>
				</scroll-view>
			</view>
		</eui-page-content>
	</eui-page-frame>
</template>

<script setup type="ts">
	import { ref, reactive, onMounted } from 'vue';
	import {useMainStore} from "@/store/modules/store";
	import {useLoginStore} from "@/store/modules/useLoginStore";
	import { validateStores } from '@/hooks/useValidateMethod';
	import dateRangUtil from '../../../../common/dateRangUtil';
	import { getRelatedName, getDictName,getDictSelectList, getDictSelect } from '../../components/RelatedName.js';
	import Enjoy from "@/common/enjoy";
	import {onLoad} from "@dcloudio/uni-app";
	import { init } from '@/hooks/init';
	import useService from '@/hooks/useService';
	const service = useService({ prefix: "scApi" });
	
	const mainStore = useMainStore();
	const LoginStore = useLoginStore();
	const EuiNavBar = ref(null);
	const RdsSearchBar = ref(null);
	
	const searchText = ref('');
	const sUserStore = ref('');
	const sUserStoreName = ref('');
	const sUser = ref('');
	const displayable = ref(false);  //true允许页面编辑
	const dataList = ref([]);
	const CurrentPage = ref(1);  //第几页
	const PageSize = ref(10);  //每页10条
	const RowsCount = ref(0);  //总条数
	const PageCount = ref(1);  //总页数
	const { loginInfo } = mainStore;
	const Items = [
		{
			label: "单号",
			prop: "c_id",
			type: "text",
			colSpan: 24,
			element: {
			},
		},
		{
			label: "配送中心",
			prop: "c_dc_store_name",
			type: "text",
			colSpan: 24,
			element: {
			},
		},
		{
			label: "部门",
			prop: "c_adno_name",
			type: "text",
			colSpan: 24,
			element: {
			
			},
		},
		{
			label: "采购员",
			prop: "c_buyer_name",
			type: "text",
			colSpan: 24,
			element: {
			},
		},
		
	]
	
	onLoad(async (option) => {
		sUserStore.value = option.storeId;
	  	await getData();
	})


	// 点击扫描图标跳转打开摄像头
	const scanCode = () => {
	  uni.scanCode({
	    success: function (res) {
	      if (res.result != '' && res.result != undefined && res.result != null) {
	        searchText.value = res.result;
	         getData();
	      }
	    },
	  });
	}
	const templateClick = (e) => {
		let pages = getCurrentPages(); //获取所有页面栈实例列表
		let prevPage = pages[pages.length - 2]; //上一页页面实例
		prevPage.$vm.$.exposed.SelectionChanged({
			type:'c_id',
			c_id:e.c_id
		}); //执行函数也是同理
		uni.navigateBack({ //uni.navigateTo跳转的返回，默认1为返回上一级
			delta: 1
		});
	};
	const searchConfirm = async (e) => {
	  console.log('=========searchConfirm: ', e);
	  if (!e) {
	    return;
	  }
	  searchText.value = e.value;
	  await getData();
	}
	// 查询数据列表
	const getData = async(e) =>{
		if (!e) {
			CurrentPage.value = 1;
			dataList.value = [];
		}
		const WhereList = [
		                    { c_col: "c_status", c_oper: "等于", c_value: '3', c_logic: "而且" },
							{ c_col: "c_dc_store_id", c_oper: "等于", c_value: sUserStore.value, c_logic: "而且" }
		                ]
		           

		if (searchText.value) {
			if (searchText.value.length > 7) {
				WhereList.push({
					c_col: "c_id",
					c_oper: "等于",
					c_value: searchText.value,
					c_logic: "而且",
				});
			} else {
				WhereList.push({
					c_col: "c_gcode",
					c_oper: "等于",
					c_value: searchText.value,
					c_logic: "而且",
				});
			}

		}
		uni.showLoading({ title: "正在加载...", mask: true })
		const req = {
			IsNotPage: false,
			CurrentPage: CurrentPage.value,
			PageSize: PageSize.value,
			UserNo: loginInfo.sUser,
			WhereList: WhereList
		}
		const result = await service.request('生鲜采购单', 'EnjoyQueryList', req,'');
		uni.hideLoading();
		CurrentPage.value = result.CurrentPage; //第几页
		PageSize.value = result.PageSize; //每页10条
		RowsCount.value = result.RowsCount; //总条数
		PageCount.value = result.PageCount; //总页数 
		const _data =  result.ReturnObject.map(x=>{
				return {
					...x,
					c_dc_store_name:x.c_dc_store_id?'['+x.c_dc_store_id+']'+getRelatedName('rdsStores', x.c_dc_store_id):'',
					c_adno_name:x.c_adno?'['+x.c_adno+']'+getRelatedName('rdsDeparts', x.c_adno):'',
					c_buyer_name:x.c_buyer_no?'['+x.c_buyer_no+']'+getRelatedName('rdsUsers', x.c_buyer_no):'',
				}
			});
		if (result.CurrentPage == 1) {
			dataList.value = _data;
		} else {
			dataList.value = dataList.value.concat(_data);
		}
	}
	const loadMore = async() => {
		if (CurrentPage.value < PageCount.value) {
			CurrentPage.value = CurrentPage.value + 1;
			await getData(true);
		}
	}
</script>
<style lang="scss" scoped>
	@import '../../../../main.scss';

	.content {
		display: flex;
		flex: 1;
		flex-direction: column;
		background-color: #F2F2F2;
		padding: 0px !important
	}

	.content-img {
		background-color: #FFFFFF;
		background-size: 100% 176rpx;
		background-repeat: no-repeat;
		width: 100%;
	}

	.navigation {
		flex: 0 0 auto;
		margin-bottom: 5px;
	}

	.footer-view {
		width: 100%;
		flex: 1;
	}

	.bt-button {
		background-color: #FFFFFF;
		padding: 10rpx 0rpx;
		display: flex;
		justify-content: space-around;
		align-items: center;
	}
</style>